<!--  CookiesOrLocalstorage Component  -->
<script>
import {messageTip, getThatData, deleteData} from "@/utils";
export default {
  props: {
    activeName:{
      type: String,
      default: 'localstorage'
    }
  },
  data(){
    return {
      tableData: [],
      loading:false
    }
  },
  methods: {
    messageTip,
    deleteData,
    getList(){
      this.loading = true
      setTimeout(()=> {
        this.loading = false
        this.tableData = getThatData(this.activeName)
      }, 1500)
    },

    deleteRow(row){
      this.loading = true
      this.deleteData(this.activeName,row)
      setTimeout(()=> {
        this.getList()
        this.messageTip('red',`删除`)
      },500)
    },

    editRow(row){
      this.$emit('editFun', {...row})
    }
  }
}
</script>

<template>
  <div v-loading="loading">
    <el-table
        :data="tableData"
        style="width: 100%">
      <el-table-column
        prop="name"
        label="姓名"
        width="180"
      />
      <el-table-column
        prop="age"
        label="年龄"
        width="180"
      />
      <el-table-column
        prop="height"
        label="身高"
      />
      <el-table-column
        prop="weight"
        label="体重"
      />
      <el-table-column
        prop="movement"
        label="运动项目"
      />
      <el-table-column
        prop="movement"
        label="运动项目"
      >
        <template slot-scope="{row}">
          <el-button size="mini" type="danger" @click="deleteRow(row)">删除</el-button>
          <el-button size="mini" @click="editRow(row)">编辑</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<style scoped>

</style>
